<template>
  <div class="web-package-detail">
    <h2
      class="title w-text-center"
      @click="linkClick"
      :class="{ 'w-hover-text w-pointer': packageModel.url }">{{ packageModel.name }}</h2>
    <p class="date w-text-center">{{ packageModel.dateStr }}</p>
    <p class="description w-text-center">{{ packageModel.describe }}</p>
    <!--marked 解析-->
    <w-marked-parsing :datastr="packageModel.content"/>
  </div>
</template>

<script>
import PackageModel from '@/models/web/PackageModel'
import WMarkedParsing from '@/components/global/marked/parsing'
export default {
  name: 'WebPackageDetail',
  components: {
    WMarkedParsing
  },
  data() {
    return {
      packageModel: new PackageModel()
    }
  },
  mounted() {
    this.findOne()
  },
  methods: {
    /**
     * 获取单个数据
     */
    findOne() {
      this.packageModel._id = this.$route.query.id
      this.packageModel.getDetail().then(() => {}).catch(() => {})
    },
    /**
     * 跳转链接
     */
    linkClick() {
      if (this.packageModel.url) {
        window.open(this.packageModel.url)
      }
    }
  }
}
</script>

<style lang="scss" scoped>

  .web-package-detail {
    padding: 20px;
    >.date {
      color: #999;
    }
    >.description {
      color: #666;
      line-height: 24px;
    }
  }

</style>
